<template>
    <div id="dr22">
        <Breadcrumb style="margin-bottom: 10px">
            <BreadcrumbItem to="/superAdmin">首页</BreadcrumbItem>
            <BreadcrumbItem>司机管理</BreadcrumbItem>
            <BreadcrumbItem>用户反馈</BreadcrumbItem>
        </Breadcrumb>
        <Select v-model="type" style="width:200px;margin-bottom: 10px" @on-change="typeChange">
            <Option v-for="item in typeList" :value="item.value" :key="item.value">{{ item.label }}</Option>
        </Select>
        <Table :maxWidth="1000" :minWidth="10" stripe :columns="columns" :data="data"
               v-if="data&&data.length>0"></Table>

        <Page :total="pageTotal" :current="curPage" @on-change="pageChange"
              style="display: inline-block;padding-top: 10px;padding-bottom: 10px" show-elevator
              v-if="data&&data.length>0"/>
        <div style="padding-left: 10px;position:relative ;display: inline-block;height: 52px;line-height: 52px;top: -12px">
            总计 {{pageTotal}} 条数据
        </div>
        <div id="loading" v-if="loading">
            <div class="spinner">
                <div class="double-bounce1"></div>
                <div class="double-bounce2"></div>
            </div>
        </div>

        <Modal v-model="replyBool">
            <p slot="header" style="color:#444;text-align:center">
                <span>回复</span>
            </p>
            <div style="text-align:left;font-size: 16px;">
                <Input v-model="replyText" type="textarea" placeholder="请输入回复内容"/>
            </div>
            <div slot="footer">
                <Button type="info" @click="replyBool=false">取消</Button>
                <Button type="info" @click="reply()">确认</Button>
            </div>
        </Modal>

    </div>
</template>
<script type="text/ecmascript-6">
    import sessionUtils from '../../model/sessionUtils';
    import ipServer from '../../model/ip';
    import Axios from 'axios';
    export default{
        data(){
            return {
                replyBool: false,
                ideaId: "",
                replyText: "",
                type: "0",
                index: 0,
                typeList: [
                    {
                        value: '0',
                        label: '未处理'
                    },
                    {
                        value: '1',
                        label: '已处理'
                    }
                ],
                loading: false,
                modeData: {},
                modeBool: false,
                pageTotal: 0,
                curPage: 0,
                columns: [
                    {
                        title: '用户类型',
                        key: 'type1',
                        width: 100,
                    },
                    {
                        title: '反馈时间',
                        key: 'registeTime1',
                        width: 155
                    },
                    {
                        title: '手机号',
                        key: 'mobile',
                        width: 120
                    },
                    {
                        title: '是否认证',
                        key: 'validStatus1',
                        width: 100,
                    }, {
                        title: '处理状态',
                        key: 'isDealWith1',
                        width: 100,
                    }, {
                        title: '反馈',
                        key: 'idea'
                    }, {
                        title: '反馈回复',
                        key: 'reply'
                    },
                    {
                        title: '操作',
                        key: 'action',
                        width: 150,
                        align: 'center',
                        render: (h, params) => {
                            return h('div', [
                                h('Button', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            /*if(params.)
                                             this.getProhibit(params);*/
                                            if (params.row.isDealWith == 1) {
                                                this.$Message.info("已经回复了!");
                                            } else {
                                                this.replyBool = true;
                                                this.ideaId = params.row._id;
                                                this.index = params.index;
                                            }
                                        }
                                    }
                                }, "回复"),
                                h('Button', {
                                    props: {
                                        type: 'error',
                                        size: 'small'
                                    },
                                    on: {
                                        click: () => {
                                            var ds = this;
                                            this.$Modal.confirm({
                                                title: "提示",
                                                content: "确定删除?",
                                                onOk(){
                                                    ds.delData(params);
                                                },
                                                onCancel(){

                                                }
                                            });
                                        }
                                    }
                                }, '删除')
                            ]);
                        }
                    }
                ],
                data: []
            }
        },
        mounted(){
            this.getData();
        },
        methods: {
            typeChange(){
                this.getData();
            },
            pageChange(page){
                this.getData(page);
            },
            rowData(data, index){
                this.modeData = data;
                this.modeBool = true;
            }, reply(){

                if (!this.replyText) {
                    this.$Message.info("请输入回复内容!");
                    return;
                }
                var param = new URLSearchParams();
                param.append('mobile', sessionUtils.getSession("mobile"));
                param.append('token', sessionUtils.getSession("token"));
                param.append('reply', this.replyText);
                param.append('ideaId', this.ideaId);
                this.loading = true;
                Axios.post(ipServer + "supervise/ideaReply", param)
                        .then(res => {

                            if (res.data.code == 0) {
                                sessionUtils.setSession("token", res.data.token);
                                this.data[this.index].isDealWith = 1;
                                this.data[this.index].isDealWith1 = "已处理";
                                this.data[this.index].reply = this.replyText;
                                this.$Message.info("回复成功!");
                                this.replyText = "";
                            } else if (res.data.code == 3) {
                                sessionUtils.clear();
                                this.$Message.info(res.data.msg);
                                this.$router.push("/login");
                            } else {
                                this.$Message.info(res.data.msg);
                            }
                            this.loading = false;
                            this.replyBool = false;
                        })
                        .catch(err=> {
                            this.loading = false;
                            this.replyBool = false;
                            this.$Message.info(err);
                        });
            },
            delData(data){
                var param = new URLSearchParams();
                param.append('mobile', sessionUtils.getSession("mobile"));
                param.append('token', sessionUtils.getSession("token"));
                param.append('ideaId', data.row._id);
                this.loading = true;
                Axios.post(ipServer + "supervise/deleteIdeaById", param)
                        .then(res => {
                            if (res.data.code == 0) {
                                sessionUtils.setSession("token", res.data.token);
                                this.data.splice(data.index, 1);
                                this.$Message.info("删除成功!");
                            } else if (res.data.code == 3) {
                                sessionUtils.clear();
                                this.$Message.info(res.data.msg);
                                this.$router.push("/login");
                            } else {
                                this.$Message.info(res.data.msg);
                            }
                            this.loading = false;
                        })
                        .catch(err=> {
                            this.loading = false;
                            this.$Message.info(err);
                        });
            },

            getData(page){
                var param = new URLSearchParams();
                param.append('mobile', sessionUtils.getSession("mobile"));
                param.append('token', sessionUtils.getSession("token"));
                param.append('isDeal', this.type);
                if (page) {
                    param.append('pageId', page + "");
                }
                this.loading = true;
                Axios.post(ipServer + "supervise/selectIdeaList", param)
                        .then(res => {
                            if (res.data.code == 0) {

                                sessionUtils.setSession("token", res.data.token);
                                for (var i = 0; i < res.data.data.result.length; i++) {
                                    res.data.data.result[i].registeTime1 = sessionUtils.timestampToTime(res.data.data.result[i].createTime);
                                    if (res.data.data.result[i].isDealWith == 0) {
                                        res.data.data.result[i].isDealWith1 = "未处理";
                                    } else {
                                        res.data.data.result[i].isDealWith1 = "已处理";
                                    }
                                    if (res.data.data.result[i].validStatus == 0) {
                                        res.data.data.result[i].validStatus1 = "未认证";
                                    } else if (res.data.data.result[i].validStatus == 1) {
                                        res.data.data.result[i].validStatus1 = "待认证";
                                    } else if (res.data.data.result[i].validStatus == 2) {
                                        res.data.data.result[i].validStatus1 = "认证失败";
                                    } else {
                                        res.data.data.result[i].validStatus1 = "已认证";
                                    }

                                    if (res.data.data.result[i].type == "1") {
                                        res.data.data.result[i].type1 = "司机";
                                    }
                                    if (res.data.data.result[i].type == "2") {
                                        res.data.data.result[i].type1 = "配件商";
                                    }
                                    if (res.data.data.result[i].type == "3") {
                                        res.data.data.result[i].type1 = "修理";
                                    }
                                    if (res.data.data.result[i].type == "4") {
                                        res.data.data.result[i].type1 = "补胎";
                                    }
                                    if (res.data.data.result[i].type == "5") {
                                        res.data.data.result[i].type1 = "审车";
                                    }
                                    if (res.data.data.result[i].type == "6") {
                                        res.data.data.result[i].type1 = "加油";
                                    }
                                    if (res.data.data.result[i].type == "7") {
                                        res.data.data.result[i].type1 = "吊车";
                                    }

                                }

                                this.data = res.data.data.result;
                                this.pageTotal = res.data.data.dataTotal;
                                this.curPage = res.data.data.curPage;
                            } else if (res.data.code == 3) {
                                sessionUtils.clear();
                                this.$router.push("/login");
                                this.$Message.info(res.data.msg);
                            } else {
                                this.$Message.info(res.data.msg);
                            }
                            this.loading = false;
                        })
                        .catch(err=> {
                            this.loading = false;
                            if (err.response.status == 504 || err.response.status == 404) {
                                Message.error({message: '服务器被吃了⊙﹏⊙∥'});
                            } else if (err.response.status == 403) {
                                Message.error({message: '权限不足,请联系管理员!'});
                            } else {
                                Message.error({message: '未知错误!'});
                            }
                        });
            }
        }
    }
</script>


<style scoped>
    @import "../../assets/css/loading.css";

</style>